<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="format-detection" content="telephone=no" />
<meta name="renderer" content="webkit">
<title>博客</title>
<!--[if lt IE 9]>
	  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->
</head>
<body>
	<jsp:include page="header.jsp" flush="true">
		<jsp:param name="menu_num" value="3"/>
	</jsp:include>
    
    <div class="tm-blog-img-container"></div>
    
    <section class="tm-section">
        <div class="container-fluid">
            <div class="row">

                <div class="col-xs-12 col-sm-12 col-md-8 col-lg-9 col-xl-9">
                    <div class="tm-blog-post">
                        <h3 class="tm-gold-text">VUE使用</h3>
                        <p>热爱所热爱的 - 生活</p>
                        <img src="img/tm-img-1010x336-1.jpg" alt="Image" class="img-fluid tm-img-post">
                        <p>Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手，还便于与第三方库或既有项目整合。</p>
                        <p>Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件[1]</p>
                        <p>Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时，Vue.js 也能完美地驱动复杂的单页应用。</p>
                    </div>
                   
                    <div class="row tm-margin-t-big">
                        <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4">
                            <div class="tm-content-box">
                                <img src="img/tm-img-310x180-1.jpg" alt="Image" class="tm-margin-b-30 img-fluid">
                                <h4 class="tm-margin-b-20 tm-gold-text">2015</h4>
                                <p class="tm-margin-b-20">给未来自己的一封信</p>
                                <a href="#" class="tm-btn text-uppercase">详情</a>    
                            </div>  
                        </div>

                        <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4">
                            <div class="tm-content-box">
                                <img src="img/tm-img-310x180-2.jpg" alt="Image" class="tm-margin-b-30 img-fluid">
                                <h4 class="tm-margin-b-20 tm-gold-text">2016</h4>
                                <p class="tm-margin-b-20">千里夜奔是件快意恩仇的事情</p>
                                <a href="#" class="tm-btn text-uppercase">Read More</a>    
                            </div>  
                        </div>

                        <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4">
                            <div class="tm-content-box">
                                <img src="img/tm-img-310x180-3.jpg" alt="Image" class="tm-margin-b-30 img-fluid">
                                <h4 class="tm-margin-b-20 tm-gold-text">2017</h4>
                                <p class="tm-margin-b-20">醒来后那总是梁山一梦</p>
                                <a href="#" class="tm-btn text-uppercase">Detail</a>    
                            </div>  
                        </div>    
                    </div>
                </div>

                <aside class="col-xs-12 col-sm-12 col-md-4 col-lg-3 col-xl-3 tm-aside-r">

                    <div class="tm-aside-container">
                        <h3 class="tm-gold-text tm-title">随笔分类</h3>
                        <nav>
                            <ul class="nav">
                                <li><a href="#" class="tm-text-link">VUE使用</a></li>
                                <li><a href="#" class="tm-text-link">Spring Boot合集</a></li>
                                <li><a href="#" class="tm-text-link">Spring Cloud合集</a></li>
                                <li><a href="#" class="tm-text-link">Docker部署</a></li>
                                <li><a href="#" class="tm-text-link">数据库</a></li>
                                <li><a href="#" class="tm-text-link">大数据</a></li>
                            </ul>
                        </nav>
                        <hr class="tm-margin-t-small">   
                        <h3 class="tm-gold-text tm-title tm-margin-t-small">常用链接</h3>
                        <nav>   
                            <ul class="nav">
                                <li><a href="#" class="tm-text-link">Spring Cloud Eureka</a></li>
                                <li><a href="#" class="tm-text-link">Spring Cloud Hystrix</a></li>
                                <li><a href="#" class="tm-text-link">Spring Cloud Feign</a></li>
                                <li><a href="#" class="tm-text-link">Spring Cloud Config</a></li>
                            </ul>
                        </nav>   
                        <hr class="tm-margin-t-small"> 
                        <div class="tm-content-box tm-margin-t-small">
                            <a href="#" class="tm-text-link"><h4 class="tm-margin-b-20 tm-thin-font">WebPack</h4></a>
                            <p class="tm-margin-b-30">WebPack可以看做是模块打包机</p>
                        </div>
                        <hr class="tm-margin-t-small">
                        <div class="tm-content-box tm-margin-t-small">
                            <a href="#" class="tm-text-link"><h4 class="tm-margin-b-20 tm-thin-font">推荐书籍</h4></a>
                            <p class="tm-margin-b-30">《深入理解Java虚拟机 JVM高级特性与最佳实践》</p>
                        </div>  
                        <hr class="tm-margin-t-small">
                        <div class="tm-content-box tm-margin-t-small">
                            <a href="#" class="tm-text-link"><h4 class="tm-margin-b-20 tm-thin-font">微服务</h4></a>
                            <p class="tm-margin-b-30">综合使用spring cloud技术实现微服务应用</p>
                        </div>      
                    </div>
                    
                </aside>

            </div>
        </div>
    </section>
   	<jsp:include page="footer.jsp" flush="true"></jsp:include>
</body>
</html>